<!--
 * @Description: 
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2023-03-07 14:36:15
 * @LastEditTime: 2023-03-08 16:26:19
 * @FilePath: \cscec-pms-admin\src\views\subcontractors\month\components\RevisionScore.vue
-->
<template>
  <base-modal
    title="修订分数"
    :closable="true"
    :visible="visible"
    destroy-on-close
    :width="1200"
    :confirm-loading="confirmLoading"
    @cancel="handleCancel()"
  >
    <a-table
      :row-key="'id'"
      :columns="columns"
      :data-source="list"
      :pagination="false"
      :scroll="{ x: 1810, y: 500 }"
      class="revision-score-table"
      bordered
    >
      <template
        :slot="scopedSlotsKey"
        slot-scope="text, record"
      >
        <BaseInputNumber
          v-if="data.type === 'revise'"
          v-model="record[scopedSlotsKey]"
          :min="0"
          :max="Number(record[examineGradeKey])"
          :precision="2"
          placeholder="请输入"
        />
        <template v-else>{{ record[scopedSlotsKey] }}</template>
      </template>
    </a-table>
    <div
      slot="footer"
      class="btn_box"
    >
      <a-button
        @click="handleCancel()"
      >
        取消
      </a-button>
      <a-button
       v-if="data.type === 'revise'"
        type="primary"
        @click="handleOk"
      >
        确定
      </a-button>
    </div>
  </base-modal>
</template>
<script>
import BaseModal from '@/components/BaseModal'
export default {
  name: 'RevisionScore' + Date.now(),
  components: {
    BaseModal
  },
  props: {
    // 模态框显示隐藏
    visible: {
      type: Boolean,
      default: false
    },
    // 弹窗数据
    data: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      // 提交loading
      confirmLoading: false,
      // 表头
      columns: [],
      // 表数据
      list: [],
      // 表头需要宽度的字段文本
      columnsTitle: {
        '考核名称': 100,
        '考核评分': 100,
        '扣分标准': 300,
        '考核人员': 200,
        '主要检查内容': 300,
        '实际考核人员': 120,
        '状态': 100,
        '实际评分': 100,
        '扣分原因': 300,
        '修订后分数': 120
      },
      // 省略显示字段
      ellipsisKey: ['扣分标准', '考核人员', '主要检查内容'],
      // 插槽字段id
      scopedSlotsKey: '',
      actualScoreKey:'',
      // 考核评分自动
      examineGradeKey: ''
    }
  },
  watch: {
    // 隐藏显示
    visible: {
      handler(val) {
        if (val) {
          const columns = this.$clone(this.data.record.headerList)
          columns.unshift({
            dataIndex: 'serial',
            formId: null,
            title: '序号',
            code: '0',
            sort: 0,
            width: 70,
            align: 'center',
            inputType: null,
            customRender: (text, record, index) => {
              return index + 1
            }
          })
          this.columns = columns.map((el) => {
            if (this.columnsTitle.hasOwnProperty(el.title)) {
              el.width = this.columnsTitle[el.title]
            }
            if (this.ellipsisKey.includes(el.title)) {
              el.ellipsis = true
            }
            // 插槽字段
            if (el.title === '修订后分数') {
              this.scopedSlotsKey = el.dataIndex
              if(this.data.type === 'revise'){
                el.fixed = 'right'
              }
              el.scopedSlots = { customRender: el.dataIndex }
            }
            if (el.title === '考核评分') {
              this.examineGradeKey = el.dataIndex
            }
            if (el.title === '实际评分') {
              this.actualScoreKey = el.dataIndex
            }
            return el
          })
          this.list = this.data.record.contentList
        }
      }
    }
  },
  methods: {
    /**
     * @description: 确认
     * @return {void}
     */
    handleOk() {
      let numerical = 0 
      const score = this.list.reduce((pre,cur)=>{
       numerical = Number(cur[this.scopedSlotsKey])?Number(cur[this.scopedSlotsKey]):Number(cur[this.actualScoreKey]);
        return pre + (numerical|| 0)
      },0)
      let grade = null
      if (score >= 90){
        grade = "优秀"
      }else if (score < 90 && score >= 80){
        grade = "良好"
      }else if (score < 80 && score >= 70){
        grade = "合格"
      }else {
        grade = "不合格"
      }
      this.data.record.revisedScore = score
      this.data.record.revisedLevel = grade
      this.handleCancel()
    },
    /**
     * @description: 取消
     * @param {boolean} refresh 是否刷新外部列表
     * @return {void}
     */
    handleCancel(refresh = false) {
      this.list = []
      if (refresh) this.$emit('refresh', refresh)
      this.$emit('update:visible', false)
    }
  }
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
.revision-score-table @{deep} .ant-table-fixed{
  margin: 0;
}
</style>
